<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	template="../WEB-INF/templates/layout.xhtml"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:a4j="http://richfaces.org/a4j">

	<ui:define name="content">
	<a4j:status onstart="#{rich:component('statepane')}.show()" onstop="#{rich:component('statepane')}.hide()" />
		<h:form>
		<rich:notifyMessages
		ajaxRendered="true" 
		id="msgErro2" 
		showSummary="false" 
		showDetail="true" 
		nonblocking="true" 
		stayTime="2000"
		sticky="true"
		/>
		
			<rich:tabPanel>
				<rich:tab header="Categoria">

						<h:panelGrid columns="1" id="panelCadastro">
							<h:outputLabel value="Descricao" for="descricao" />
							
							<h:inputText value="#{mbCategoria.categoria.descricao}"
								id="descricao">
								<f:validateLength minimum="5" />
							</h:inputText>
					
							<h:commandButton action="#{mbCategoria.insertCategoria()}"
								value="Salvar" id="btnSalvar" />
						</h:panelGrid>
						

					
						<rich:dataTable value="#{mbCategoria.listarCategoria}" var="cat"
							id="table" rows="20" rowClasses="odd-row, even-row"
							styleClass="stable"
							style="margin-top: 20px"
							iterationStatusVar="it">
							<rich:column>
								<f:facet name="header">
									<h:outputText value="Descrição " />
								</f:facet>
								<h:outputText value="#{cat.descricao}" />
							</rich:column>

							<rich:column style="text-align:center;">
								<f:facet name="header">Editar</f:facet>
								<a4j:commandButton value="Editar" action="#{mbCategoria.editarCategoria(cat)}"  render="panelCadastro" />
							</rich:column>

							<rich:column style="text-align:center;">
								<f:facet name="header">Excluir</f:facet>
								<a4j:commandButton value="Excluir" oncomplete="#{rich:component('confirmepane')}.show();" >
									<a4j:param value="#{cat.id}" assignTo="#{mbCategoria.categoria.id}"/>
								</a4j:commandButton>
							</rich:column>

							

							<f:facet name="footer">
								<rich:dataScroller page="#{mbCategoria.page}" />
							</f:facet>
							
						</rich:dataTable>
						
						<a4j:jsFunction name="remove"
								action="#{mbCategoria.excluirCategoria()}" render="table"
								execute="@this"
								oncomplete="#{rich:component('confirmepane')}.hide();" id="jsfc" />
								
						<h:panelGroup >
							<rich:popupPanel autosized="true" modal="true" id="confirmepane">
									<h:outputText value="Deseja Excluir o Registro?" />
									<a4j:commandButton value="Excluir" onclick="remove(); return false;" />
									<a4j:commandButton value="Cancelar" onclick="#{rich:component('confirmepane')}.hide(); return false;" />
							</rich:popupPanel>
						</h:panelGroup>
						
					
					<rich:popupPanel id="statepane" modal="false" autosized="false" width="70" height="80" > 
						<h:graphicImage name="loader.gif" library="imagens" alt="ai" />
					</rich:popupPanel>
					
				</rich:tab>
			</rich:tabPanel>
		</h:form>
	
	</ui:define>
</ui:composition>